/*
 * @Author: wangqizhang
 * @Date: 2024-04-24 10:18:15
 * @LastEditors: wangqizhang
 * @LastEditTime: 2024-05-23 19:45:39
 * @FilePath: /suixinji-react/src/components/ActionBar/index.tsx
 * @Description:
 *
 * Copyright (c) 2024 by ${git_name_email}, All Rights Reserved.
 */
import React from 'react';
import { Space, Button, message } from 'antd';
import {
  FullscreenOutlined,
  MessageFilled,
  PoweroffOutlined,
  HeartOutlined,
  GithubOutlined,
  UserOutlined,
} from '@ant-design/icons';
import { fullScreen, removeSessionStorage } from '../../untils';
import { useNavigate } from 'react-router-dom';

const ActionBar = () => {
  const navigate = useNavigate();
  const buttonStyle: any = {
    width: '40px',
    height: '40px',
    display: 'flex',
    justifyContent: 'center',
    alignItems: 'center',
    boxSizing: 'border-box',
  };
  const buttonList = [
    {
      type: 'default',
      danger: false,
      title: '消息',
      icon: <MessageFilled></MessageFilled>,
      click: () => {},
    },
    {
      type: 'default',
      danger: false,
      title: '收藏',
      icon: <HeartOutlined></HeartOutlined>,
      click: () => {},
    },
    {
      type: 'default',
      danger: false,
      title: '全屏',
      icon: <FullscreenOutlined></FullscreenOutlined>,
      click: () => {
        fullScreen();
      },
    },
    {
      type: 'default',
      danger: false,
      title: 'github',
      icon: <GithubOutlined></GithubOutlined>,
      click: () => {
        window.open('https://gitee.com/wqz_ever/suixinji-react');
      },
    },
    {
      type: 'default',
      danger: true,
      title: '退出',
      icon: <PoweroffOutlined></PoweroffOutlined>,
      click: () => {
        removeSessionStorage('token');
        message.success('退出成功');
        setTimeout(() => {
          navigate('/login');
        }, 500);
      },
    },
    {
      type: 'default',
      danger: false,
      title: '个人信息',
      icon: <UserOutlined></UserOutlined>,
      click: () => {
        window.open('https://gitee.com/wqz_ever/suixinji-react');
      },
    },
  ];
  return (
    <Space>
      {buttonList.map((item, index) => {
        return (
          <Button
            key={index}
            style={buttonStyle}
            danger={item.danger}
            onClick={() => {
              item.click();
            }}
          >
            {item.icon}
          </Button>
        );
      })}
      {/* <Button style={buttonStyle}>
          <MessageFilled></MessageFilled>
        </Button>
        <Button style={buttonStyle}>
          <HeartOutlined></HeartOutlined>
        </Button>
        <Button onClick={() => fullScreen()} style={buttonStyle}>
          <FullscreenOutlined></FullscreenOutlined>
        </Button>
        <Button style={buttonStyle}>
          <GithubOutlined></GithubOutlined>
        </Button>
        <Button danger style={buttonStyle}>
          <PoweroffOutlined></PoweroffOutlined>
        </Button> */}
    </Space>
  );
};
export default ActionBar;
